﻿<div class="x-nav">
	<span class="layui-breadcrumb">
		<a><cite>首页</cite></a>
		<a><cite>会员管理</cite></a>
		<a><cite>问题/资讯列表</cite></a>
	</span>
	<a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新"><i class="layui-icon" style="line-height:30px">ဂ</i></a>
</div>
<div class="x-body">
	<fieldset class="table-search-fieldset">
		<legend>搜索信息</legend>
		<div style="margin: 10px 10px 10px 10px">
			<form class="layui-form layui-form-pane" action="">
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">作品名称</label>
						<div class="layui-input-inline">
							<select id="productId" name="productId" asp-items="@ViewBag.ProTypeList">
								<option value="0">请选择</option>
							</select>
						</div>
					</div>
					<div class="layui-inline">
						<button type="button" class="layui-btn layui-btn-primary" id="btnSearch" lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
						<button type="button" class="layui-btn layui-btn-warm" id="add">添   加</button>
					</div>
				</div>
			</form>
		</div>
	</fieldset>
	<table id="currentTableId" lay-filter="currentTableFilter">
	</table>

	<script type="text/html" id="currentTableBar">
		<a class="layui-btn layui-btn-normal layui-btn-xs data-count-edit" lay-event="edit">编辑</a>
		<a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
	</script>
	<style>
		.layui-table-cell {
			text-align: center;
			display: table-cell;
			vertical-align: middle;
		}
	</style>
	<div id="page"></div>
</div>
@section Scripts{
	<script>
		layui.use(['laydate', 'laypage', 'layer', 'table'], function () {
			$ = layui.jquery;//jquery
			laydate = layui.laydate;//日期插件
			laypage = layui.laypage;//分页
			layer = layui.layer;//弹出层
			table = layui.table;

			table.render({
				elem: '#currentTableId',
				url: '/Admin/ProPicture/List',
				toolbar: '#toolbarDemo',
				//defaultToolbar: ['filter', 'exports', 'print', {
				//    title: '提示',
				//    layEvent: 'LAYTABLE_TIPS',
				//    icon: 'layui-icon-tips'
				//}],
				cols: [[
					{ type: "checkbox", width: 50 },
					{ field: 'ppId', title: 'ID', sort: true },
					{
						field: 'ppName', title: '作品图片',
						templet: '<div><img src="/{{d.ppName}}" /></div>;'
					},
					{ field: 'pName', title: '作品名称', sort: true },
					{ title: '操作', toolbar: '#currentTableBar', align: "center" }
				]],
				limits: [5, 10, 15, 20, 25, 50, 100],
				limit: 5,
				page: true,
				skin: 'line'
			});
			$("#btnSearch").click(function () {
				var productId = $("#productId").val();
				table.reload("currentTableId", {
					where: {
						productId: productId
					}
				});
				return false;
			});
			$("#add").click(function (obj) {
				layer.open({
					type: 2,
					content: '/Admin/Product/Add',
					area: ['800px', '450px']
				});
			});
			table.on('tool(currentTableFilter)', function (obj) {
				var data = obj.data;
				alert(obj.data.pId);
				if (obj.event === 'edit') {
					layer.open({
						type: 2,
						content: '/Admin/Product/Edit?pId=' + obj.data.pId, //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
						area: ['800px', '450px']
					});
					return false;
				} else if (obj.event === 'delete') {
					layer.confirm('真的不要我了吗', function (index) {
						$.post("/Admin/Product/Delete", { pId: data.pId }, function (re) {
							if (re.success) {
								layer.msg(re.msg);
								$("#btnSearch").click();
							} else {
								layer.msg(re.msg);
							}
						}, "json");
						layer.close(index);
					});

				}
			});
		});


	</script>
}